<form method="POST" action="{{ script_root }}/admin/chal/new" enctype="multipart/form-data">
	<div class="form-group">
		<div class="alert alert-secondary" role="alert">
			Dynamic docker challenge that allows the player to deploy a standalone instance for this challenge.
		</div>
	</div>

	<div class="form-group">
		<label for="name">Name<br>
			<small class="form-text text-muted">
				The name of your challenge
			</small>
		</label>
		<input type="text" class="form-control" name="name" placeholder="Enter challenge name">
	</div>
	<div class="form-group">
		<label for="category">Category<br>
			<small class="form-text text-muted">
				The category of your challenge
			</small>
		</label>
		<input type="text" class="form-control" name="category" placeholder="Enter challenge category">
	</div>

	<ul class="nav nav-tabs" role="tablist" id="new-desc-edit">
		<li class="nav-item">
			<a class="nav-link active" href="#new-desc-write" aria-controls="home" role="tab"
			   data-toggle="tab">Write</a>
		</li>
		<li class="nav-item">
			<a class="nav-link" href="#new-desc-preview" aria-controls="home" role="tab" data-toggle="tab">Preview</a>
		</li>
	</ul>

	<div class="tab-content">
		<div role="tabpanel" class="tab-pane active" id="new-desc-write">
			<div class="form-group">
				<label for="message-text" class="control-label">Message
					<small class="form-text text-muted">
						Use this to give a brief introduction to your challenge. The description supports HTML and
						Markdown.
					</small>
				</label>
				<textarea id="new-desc-editor" class="form-control" name="description" rows="10"></textarea>
			</div>
		</div>
		<div role="tabpanel" class="tab-pane content" id="new-desc-preview" style="height:234px; overflow-y: scroll;">
		</div>
	</div>

	<div class="form-group">
		<label for="value">Initial Value<br>
			<small class="form-text text-muted">
				This is how many points the challenge is worth initially.
			</small>
		</label>
		<input type="number" class="form-control" name="value" placeholder="Enter value" required>

	</div>

	<div class="form-group">
		<label for="value">Decay Limit<br>
			<small class="form-text text-muted">
				The amount of solves before the challenge reaches its minimum value
			</small>
		</label>
		<input type="number" class="form-control" name="decay" placeholder="Enter decay limit" required>
	</div>

	<div class="form-group">
		<label for="value">Minimum Value<br>
			<small class="form-text text-muted">
				This is the lowest that the challenge can be worth
			</small>
		</label>
		<input type="number" class="form-control" name="minimum" placeholder="Enter minimum value" required>

	</div>

    <div class="form-group">
		<label for="value">Docker Image<br>
			<small class="form-text text-muted">
				The docker image used to deploy
			</small>
		</label>
		<input type="text" class="form-control" name="docker_image" placeholder="Enter docker image name" required>

	</div>

    <div class="form-group">
		<label for="value">Frp Redirect Type<br>
			<small class="form-text text-muted">
				Decide the redirect type how frp redirect traffic
			</small>
		</label>

        <select class="form-control" name="redirect_type">
            <option value="http" selected>HTTP</option>
            <option value="direct">Direct</option>
        </select>
	</div>

    <div class="form-group">
		<label for="value">Frp Redirect Port<br>
			<small class="form-text text-muted">
				Decide which port in the instance that frp should redirect traffic for
			</small>
		</label>
		<input type="number" class="form-control" name="redirect_port" placeholder="Enter the port you want to open" required>

	</div>

    <div class="form-group">
		<label for="value">Docker Container Memory Limit<br>
			<small class="form-text text-muted">
				The memory usage limit
			</small>
		</label>
		<input type="text" class="form-control" name="memory_limit" placeholder="Enter the memory limit" value="128m" required>

	</div>

    <div class="form-group">
		<label for="value">Docker Container CPU Limit<br>
			<small class="form-text text-muted">
				The CPU usage limit
			</small>
		</label>
		<input type="number" class="form-control" name="cpu_limit" placeholder="Enter the cpu limit" value="0.5" required>

	</div>

	<input type="hidden" name="state" value="hidden">
	<input type="hidden" value="dynamic_docker" name="type" id="chaltype">

    <div class="form-group">
		<label for="value">Score Type<br>
			<small class="form-text text-muted">
				Decide it use dynamic score or not
			</small>
		</label>

        <select class="form-control" name="dynamic_score">
            <option value="0" selected>Static Score</option>
            <option value="1">Dynamic Score</option>
        </select>
	</div>

	<div class="form-group">
		<button class="btn btn-primary float-right create-challenge-submit" type="submit">Create</button>
	</div>
</form>